 <!DOCTYPE html> 
<html>
  <head>
    <meta name="viewport">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>test</title>
    <style>
      body{
        margin: 0;
        /* transform: scale(0.5); */
        /* zoom: 0.5; */
        /* padding-left: 100px; */
      }
      #wrap{
        margin: 0;
        width: 100%;
      }
      chimee-control-ok{
        color: #fff;
      }
    </style>
  </head>
  <body>
    <div id="wrap"></div>
  </body>
  <script src="https://s5.ssl.qhres.com/static/588b46b97caa0749.js"></script>
  <script src="../node_modules/chimee/lib/index.browser.js"></script>
  <script src="../node_modules/chimee-plugin-mobile-state/lib/index.browser.js"></script>
  <script src="../lib/index.browser.js"></script>
  <script>
    const vConsole = new VConsole();
    Chimee.install(chimeePluginMobileControlbar);
    Chimee.install(chimeePluginMobileState);
    var player = new Chimee({
      wrapper: '#wrap',
      src: 'http://yunxianchang.live.ujne7.com/vod-system-bj/103_371ab0c0fda-143d-4755-8727-d3cd12dce02d.mp4',
      playbackRate: 0.5,
      volume: 0,
      isLive: false,
      playsInline: true,
      x5VideoPlayerFullscreen: true,
      x5VideoOrientation: true,
      xWebkitAirplay: true,
      preload: 'auto',
      plugin: [
        chimeePluginMobileState.name,
        {
          name: chimeePluginMobileControlbar.name,
          hideBarTime: 2000,
          // children: {
          //   play: {},
          //   currentTime: {},
          //   totalTime: {},
          //   screen: {
          //     event: {
          //       tap() {
          //         alert(1)
          //       }
          //     }
          //   }
          // }
          children: {
            play: {},
            currentTime: {},
            progressBar: {},
            totalTime: {},            
            screen: {},
            ok: {
              tag: 'chimee-control-ok',
              html: `ok`,
              event: {
                tap() {
                  console.log(this)
                }
              }
            }
          }
        }
      ],
      controls: true,
      autoplay: false
    });

    player.$on('barShow', function () {
      console.log('show')
    })

    player.$on('barHide', function () {
      console.log('hide')
    })
  </script>
</html>